<?php
    $like = model('like');
    // 检查用户是否点赞过该帖子
    $liked = $like->checkIfLiked(segment(3, 'int'));
?>

<?php if(session('user_id')): ?>
    <?php if($liked): ?>
        <!-- 取消赞 -->
        <a href="javascript:;" class="post-action-like liked js-like" data-pid="<?= $post->id ?>" data-bs-toggle="tooltip" data-bs-trigger="hover" title="取消喜欢">
            <div class="d-flex justify-content-center post-action-icon">
                <i class="iconfont icon-heart-fill"></i>
            </div>
    <?php else: ?>
        <!-- 点赞 -->
        <a href="javascript:;" class="post-action-like js-like" data-pid="<?= $post->id ?>" data-bs-toggle="tooltip" data-bs-trigger="hover" title="喜欢">
            <div class="d-flex justify-content-center post-action-icon">
                <i class="iconfont icon-heart"></i>
            </div>
    <?php endif ?>
<?php else: ?>
        <!-- 提醒登录 -->
        <a href="javascript:;" class="post-action-like js-jump" data-bs-toggle="tooltip" data-bs-trigger="hover" title="喜欢">
            <div class="d-flex justify-content-center post-action-icon">
                <i class="iconfont icon-heart"></i>
            </div>
<?php endif ?>
            <span class="js-likesNum<?= $post->id ?>"><?= $post->likes ?></span>
        </a>

<script>
document.addEventListener("DOMContentLoaded", function() {
    // 点赞
    const jLike = document.querySelector('.js-like');

    if (jLike) {
        jLike.addEventListener('click', function () {
            const pid = jLike.getAttribute('data-pid');
            const likesNumSelector = `.js-likesNum${pid}`;
            const likesNumElement = document.querySelector(likesNumSelector);
            const postActionLikeElement = document.querySelector('.post-action-like');
            const iconHeartFillElement = document.querySelector('.icon-heart-fill');
            const iconHeartElement = document.querySelector('.icon-heart');
            let num = parseInt(likesNumElement.textContent);

            fetch(`/like/love/${pid}`)
                .then(response => response.json())
                .then(res => {
                    if (res.status === 'success') {
                        if (jLike.classList.contains('liked')) {
                            num--;
                            postActionLikeElement.setAttribute('data-bs-original-title', '喜欢');
                            iconHeartFillElement.classList.remove('icon-heart-fill');
                            iconHeartFillElement.classList.add('icon-heart');
                        } else {
                            num++;
                            postActionLikeElement.setAttribute('data-bs-original-title', '取消喜欢');
                            iconHeartElement.classList.remove('icon-heart');
                            iconHeartElement.classList.add('icon-heart-fill');
                        }
                        jLike.classList.toggle('liked');
                        likesNumElement.textContent = num;
                    } else {
                        toast.error(res.message);
                    }
                })
                .catch(error => {
                    console.error('Error:', error);
                });
        });
    }

    const jsJump = document.querySelectorAll('.js-jump');
    if (jsJump) {
        jsJump.forEach(function(element) {
            element.addEventListener('click', function(e) {
                e.preventDefault();

                toast.info('正在跳转至登录页面...');
                setTimeout(function() {
                    location.href = "/user/login";
                }, 1500);
            });
        });
    }
});
</script>